body {
    margin: 0px;
    padding: 0px;
}

#heade_image:hover {
    cursor: pointer;
}

/*宽度大于768px*/
@media all and (min-width: 768px) {
    #heade_image {
        width: 150px;
        position: absolute;
        margin-left: -100px;
        margin-top: -80px;
        top: 50%;
        left: 50%;
        display: block;
        z-index: 2000;
        border-radius: 50%;
        animation: change 9s infinite linear;
        outline: none;
    }
}

/*宽度小于766px*/
@media all and (max-width: 766px) {
    #heade_image {
        width: 150px;
        position: absolute;
        margin-left: -100px;
        margin-top: -80px;
        top: 30%;
        left: 55%;
        display: block;
        z-index: 2;
        border-radius: 50%;
        animation: change 10s infinite linear;
    }

}

@keyframes change {
    10% {
        transform: rotate(36deg);
    }
    20% {
        transform: rotate(72deg);
    }
    30% {
        transform: rotate(108deg);
    }
    40% {
        transform: rotate(144deg);
    }
    50% {
        transform: rotate(180deg);
    }
    60% {
        transform: rotate(216deg);
    }
    70% {
        transform: rotate(252deg);
    }
    80% {
        transform: rotate(288deg);
    }
    90% {
        transform: rotate(324deg);
    }
    100% {
        transform: rotate(360deg);
    }

}